<style lang="less" scoped>
@import "./ownerAuth.less";
</style>
<template>
  <div class="own-space">
    <Card class="own-space-new">
      <p style="margin-left: 13px" slot="title">{{ currMenu }}</p>
      <div class="">
        <div style="width: 240px">
          <Menu :active-name="activeName" theme="light" @on-select="changeMenu">
          </Menu>
        </div>
        <div style="padding: 10px; width: 100%; margin-top: 10px">
          <div class="title">
            <!-- {{ currMenu == "个人认证" ? "个人认证" : "" }} -->
          </div>
          <div>
            <div v-show="currMenu == '个人认证'" class="safe">
              <div></div>
              <div style="width: 750px; margin-left: -16px">
                <p class="titles1">身份证信息</p>
                <div>
                  <Form
                    :model="idCardIdForm"
                    :rules="formValidate"
                    :label-width="95"
                    ref="idCardIdForm"
                    inline
                  >
                    <div style="margin-left: 5px">
                      <div style="display: flex">
                        <div style="margin-left: -30px">
                          <FormItem label="姓名" prop="name">
                            <Input
                              style="width: 220px"
                              placeholder="请输入姓名"
                              v-model="idCardIdForm.name"
                            />
                          </FormItem>
                        </div>
                        <div>
                          <FormItem label="联系电话" prop="contactPhone">
                            <Input
                              disabled
                              placeholder="请输入联系电话"
                              style="width: 190px"
                              v-model="idCardIdForm.contactPhone"
                              clearable
                            />
                          </FormItem>
                        </div>
                      </div>
                      <div style="margin-left: -30px">
                        <FormItem label="性别" prop="sex">
                          <Input
                            placeholder="请输入性别"
                            style="width: 220px"
                            v-model="idCardIdForm.sex"
                            clearable
                          />
                        </FormItem>

                        <FormItem label="出生日期" prop="birth">
                          <Input
                            placeholder="请输入出生日期"
                            style="width: 195px"
                            v-model="idCardIdForm.birth"
                            clearable
                          />
                        </FormItem>
                      </div>
                      <div style="display: flex">
                        <div style="margin-left: 12px">
                          <FormItem label="身份有效期" prop="endDate">
                            <Input
                              placeholder="请输入身份有效期"
                              style="width: 178px"
                              v-model="idCardIdForm.endDate"
                              clearable
                            />
                          </FormItem>
                        </div>
                        <div>
                          <FormItem label="身份证号" prop="num">
                            <Input
                              placeholder="请输入身份证号"
                              style="width: 200px"
                              v-model="idCardIdForm.num"
                              clearable
                            />
                          </FormItem>
                        </div>
                      </div>
                      <div style="display: flex">
                        <div>
                          <FormItem label="家庭地址" prop="address">
                            <Input
                              placeholder="请输入家庭地址"
                              v-model="idCardIdForm.address"
                              clearable
                              style="width: 267%"
                            />
                          </FormItem>
                        </div>
                      </div>
                    </div>

                    <Row style="margin-left: 21px">
                      <Col span="8">
                        <div class="demo-upload-list-company">
                          <img
                            v-if="idCardFontPicFileUrl != ''"
                            style="width: 58px"
                            height="100px"
                            :src="idCardFontPicFileUrl"
                          />
                          <img
                            style="width: 58px"
                            height="100px"
                            src="@/assets/vehicleAtes/owner1.png"
                          />
                          <div
                            v-if="idCardFontPicFileUrl != ''"
                            class="demo-upload-list-company-cover"
                          >
                            <Icon
                              type="ios-eye-outline"
                              @click.native="showPic(idCardFontPicFileUrl)"
                            ></Icon>
                          </div>
                        </div>
                        <Upload
                          :beforeUpload="beforeUpload"
                          ref="fontUpload"
                          :on-progress="cardFontProcess"
                          :show-upload-list="false"
                          :on-success="cardFontHandleSuccess"
                          :format="['jpg', 'jpeg', 'png']"
                          :max-size="20480"
                          :on-exceeded-size="handleMaxSize"
                          :on-format-error="handleFormatError"
                          :headers="header"
                          :data="{
                            fileType: 'IDCARD_FONT_PIC',
                            userId: userCompanyInfoData.userId,
                          }"
                          type="drag"
                          :action="uploadIdCardPic"
                          style="display: inline-block; width: 30px"
                        >
                          <div
                            style="width: 30px; height: 30px; line-height: 30px"
                          >
                            <Icon type="ios-camera" size="20"></Icon>
                          </div>
                        </Upload>
                        <div class="demo-uploadcss-compny">
                          <template>
                            <Progress
                              v-if="progressFlagnum"
                              text-inside
                              :percent="load"
                              :stroke-width="3"
                            ></Progress>
                          </template>
                        </div>
                        <div style="margin-top: 15px" class="check">
                          <span class="check_font">身份证正面</span>
                        </div>
                      </Col>
                      <Col span="8" style="margin-left: 5px">
                        <div class="demo-upload-list-company">
                          <img
                            v-if="idCardBackPicFileUrl != ''"
                            style="width: 58px"
                            height="100px"
                            :src="idCardBackPicFileUrl"
                          />
                          <img
                            style="width: 58px"
                            height="100px"
                            src="@/assets/vehicleAtes/owner2.png"
                          />
                          <div
                            v-if="idCardBackPicFileUrl != ''"
                            class="demo-upload-list-company-cover"
                          >
                            <Icon
                              type="ios-eye-outline"
                              @click.native="showPic(idCardBackPicFileUrl)"
                            ></Icon>
                          </div>
                        </div>

                        <Upload
                          :on-progress="scardBackPro"
                          :beforeUpload="beforeUpload"
                          ref="backUpload"
                          :show-upload-list="false"
                          :on-success="cardBackHandleSuccess"
                          :before-upload="handleBeforeUpload"
                          :max-size="20480"
                          :on-exceeded-size="handleMaxSize"
                          :on-format-error="handleFormatError"
                          :format="['jpg', 'jpeg', 'png']"
                          type="drag"
                          :default-file-list="idCardBackPicFileList"
                          :headers="header"
                          :data="{
                            fileType: 'IDCARD_BACK_PIC',
                            userId: userCompanyInfoData.userId,
                          }"
                          :action="uploadIdCardPic"
                          style="display: inline-block; width: 30px"
                        >
                          <div
                            style="width: 30px; height: 30px; line-height: 30px"
                          >
                            <Icon type="ios-camera" size="20"></Icon>
                          </div>
                        </Upload>
                        <div class="demo-uploadcss-compny">
                          <template>
                            <Progress
                              v-if="personalIDCard"
                              text-inside
                              :percent="load"
                              :stroke-width="3"
                            ></Progress>
                          </template>
                        </div>
                        <div style="margin-top: 15px" class="check">
                          <span class="check_font">身份证反面</span>
                        </div>
                      </Col>
                      <Col span="7" style="margin-left: 5px">
                        <div class="demo-upload-list-company">
                          <img
                            v-if="personalIDCardUrl != ''"
                            style="width: 58px"
                            height="100px"
                            :src="personalIDCardUrl"
                          />
                          <img
                            style="width: 58px"
                            height="100px"
                            src="@/assets/vehicleAtes/owner2.png"
                          />
                          <div
                            v-if="personalIDCardUrl != ''"
                            class="demo-upload-list-company-cover"
                          >
                            <Icon
                              type="ios-eye-outline"
                              @click.native="showPic(personalIDCardUrl)"
                            ></Icon>
                          </div>
                        </div>

                        <Upload
                          :on-progress="CardBackPro"
                          :beforeUpload="beforeUpload"
                          ref="backUpload"
                          :show-upload-list="false"
                          :on-success="personalIDSuccess"
                          :before-upload="handleBeforeUpload"
                          :max-size="20480"
                          :on-exceeded-size="handleMaxSize"
                          :on-format-error="handleFormatError"
                          :format="['jpg', 'jpeg', 'png']"
                          type="drag"
                          :default-file-list="idCardBackPicFileList"
                          :headers="header"
                          :data="{
                            fileType: 'IDCARD_FONT_PIC',
                            userId: userCompanyInfoData.userId,
                          }"
                          :action="uploadIdCardPic"
                          style="display: inline-block; width: 30px"
                        >
                          <div
                            style="width: 30px; height: 30px; line-height: 30px"
                          >
                            <Icon type="ios-camera" size="20"></Icon>
                          </div>
                        </Upload>
                        <div class="demo-uploadcss-compny">
                          <template>
                            <Progress
                              v-if="progressCardBack"
                              text-inside
                              :percent="load"
                              :stroke-width="3"
                            ></Progress>
                          </template>
                        </div>
                        <div style="margin-top: 15px" class="check">
                          <span class="check_font">手持身份证</span>
                        </div>
                      </Col>
                    </Row>
                    <Row>
                      <Col>
                        <Button
                          style="margin-left: 21px; margin-top: 20px"
                          type="warning"
                          :loading="loadingsubmi"
                          @click="realNameAuthentication"
                          >提交认证</Button
                        >
                      </Col>
                    </Row>
                  </Form>
                </div>
              </div>
            </div>
            <div v-show="currMenu == '企业认证'" class="safe">
              <div></div>
              <div>
                <Form
                  :model="companyLicenseForm"
                  ref="companyLicenseForm"
                  :rules="companyForm"
                  :label-width="135"
                  inline
                >
                  <div style="display: flex">
                    <div style="width: 750px; margin-left: -36px">
                      <p class="titles">企业信息</p>
                      <div style="margin-left: -17px">
                        <div style="display: flex">
                          <div>
                            <FormItem label="公司名称" prop="companyName">
                              <Input
                                placeholder="请输入公司名称"
                                style="width: 220px"
                                v-model="companyLicenseForm.companyName"
                                clearable
                              />
                            </FormItem>
                          </div>
                          <div style="margin-left: 51px">
                            <FormItem label="统一社会信用代码" prop="certNo">
                              <Input
                                placeholder="请输入统一社会信用代码"
                                v-model="companyLicenseForm.certNo"
                                style="width: 170px"
                              />
                            </FormItem>
                          </div>
                        </div>
                        <FormItem label="公司类型" prop="type">
                          <Input
                            placeholder="请输入公司类型"
                            style="width: 220px"
                            v-model="companyLicenseForm.type"
                            clearable
                          />
                        </FormItem>
                        <FormItem label="通讯地址" prop="street">
                          <Input
                            placeholder="请输入通讯地址"
                            style="width: 220px"
                            v-model="companyLicenseForm.street"
                            clearable
                          />
                        </FormItem>
                        <div style="display: flex">
                          <div style="margin-left: 14px">
                            <FormItem label="法定代表人" prop="companyUserName">
                              <Input
                                style="width: 206px"
                                placeholder="请输入法定代表人"
                                v-model="companyLicenseForm.companyUserName"
                                clearable
                              />
                            </FormItem>
                          </div>
                          <div>
                            <FormItem label="注册电话" prop="companyUserPhone">
                              <Input
                                placeholder="请输入注册电话"
                                style="width: 220px"
                                v-model="companyLicenseForm.companyUserPhone"
                                clearable
                              />
                            </FormItem>
                          </div>
                        </div>

                        <FormItem label="开户银行" prop="bankName">
                          <Input
                            placeholder="请输入开户银行"
                            style="width: 220px"
                            v-model="companyLicenseForm.bankName"
                            clearable
                          />
                        </FormItem>
                        <FormItem label="银行账号" prop="bankCode">
                          <Input
                            placeholder="请输入银行账号"
                            style="width: 220px"
                            v-model="companyLicenseForm.bankCode"
                            clearable
                          />
                        </FormItem>
                      </div>

                      <Row style="margin-left: 44px">
                        <Col span="8">
                          <div class="demo-upload-list-company">
                            <img
                              v-if="companyPicFileUrl != ''"
                              style="width: 58px"
                              height="100px"
                              :src="companyPicFileUrl"
                            />
                            <img
                              style="width: 58px"
                              height="100px"
                              src="@/assets/vehicleAtes/owner3.png"
                            />
                            <div
                              v-if="companyPicFileUrl != ''"
                              class="demo-upload-list-company-cover"
                            >
                              <Icon
                                type="ios-eye-outline"
                                @click.native="showPic(companyPicFileUrl)"
                              ></Icon>
                            </div>
                          </div>
                          <Upload
                            :on-progress="BusinessLicen"
                            :beforeUpload="beforeUpload"
                            ref="companyUpload"
                            :show-upload-list="false"
                            :on-success="handleSuccess"
                            :format="['jpg', 'jpeg', 'png']"
                            :on-format-error="handleFormatError"
                            :headers="header"
                            :data="{
                              fileType: 'IDCARD_FONT_PIC',
                              userId: userCompanyInfoData.userId,
                            }"
                            type="drag"
                            :action="upLoadCompanyLicense"
                            style="display: inline-block; width: 30px"
                          >
                            <div
                              style="
                                width: 30px;
                                height: 30px;
                                line-height: 30px;
                              "
                            >
                              <Icon type="ios-camera" size="20"></Icon>
                            </div>
                          </Upload>
                          <div class="demo-uploadcss-compny">
                            <template>
                              <Progress
                                v-if="progressBusinessLicen"
                                text-inside
                                :percent="load"
                                :stroke-width="3"
                              ></Progress>
                            </template>
                          </div>
                          <div style="margin-top: 15px" class="check">
                            <span class="check_font">营业执照</span>
                          </div>
                        </Col>
                      </Row>
                    </div>
                    <div style="width: 810px; padding-left: 40px">
                      <p class="titles">联系人信息</p>
                      <div style="margin-left: -44px">
                        <FormItem label="姓名" prop="contactName">
                          <Input
                            style="width: 220px"
                            placeholder="请输入姓名"
                            v-model="companyLicenseForm.contactName"
                          />
                        </FormItem>
                        <FormItem label="联系电话" prop="contactPhone">
                          <Input
                            disabled
                            placeholder="请输入联系电话"
                            v-model="companyLicenseForm.contactPhone"
                            clearable
                            style="width: 220px"
                          />
                        </FormItem>
                      </div>
                      <div style="margin-left: -2px">
                        <FormItem label="身份有效期" prop="contactEndDate">
                          <Input
                            placeholder="请输入身份有效期"
                            style="width: 180px"
                            v-model="companyLicenseForm.contactEndDate"
                            clearable
                          />
                        </FormItem>
                        <FormItem label="身份证号" prop="contactNum">
                          <Input
                            placeholder="请输入身份证号"
                            style="width: 220px"
                            v-model="companyLicenseForm.contactNum"
                            clearable
                          />
                        </FormItem>
                      </div>
                      <Row style="margin-left: 44px; margin-top: 20px">
                        <Col span="8">
                          <div class="demo-upload-list-company">
                            <img
                              v-if="enterpriseIdCardFontPicFileUrl != ''"
                              style="width: 58px"
                              height="100px"
                              :src="enterpriseIdCardFontPicFileUrl"
                            />
                            <img
                              style="width: 58px"
                              height="100px"
                              src="@/assets/vehicleAtes/owner1.png"
                            />
                            <div
                              v-if="enterpriseIdCardFontPicFileUrl != ''"
                              class="demo-upload-list-company-cover"
                            >
                              <Icon
                                type="ios-eye-outline"
                                @click.native="
                                  showPic(enterpriseIdCardFontPicFileUrl)
                                "
                              ></Icon>
                            </div>
                          </div>
                          <Upload
                            :on-progress="enterprIseidCard"
                            :beforeUpload="beforeUpload"
                            ref="companyUpload"
                            :show-upload-list="false"
                            :on-success="enterpriseID"
                            :format="['jpg', 'jpeg', 'png']"
                            :on-format-error="handleFormatError"
                            :headers="header"
                            :data="{
                              fileType: 'IDCARD_FONT_PIC',
                              userId: userCompanyInfoData.userId,
                            }"
                            type="drag"
                            :action="uploadIdCardPic"
                            style="display: inline-block; width: 30px"
                          >
                            <div
                              style="
                                width: 30px;
                                height: 30px;
                                line-height: 30px;
                              "
                            >
                              <Icon type="ios-camera" size="20"></Icon>
                            </div>
                          </Upload>
                          <div class="demo-uploadcss-compny">
                            <template>
                              <Progress
                                v-if="progressFront"
                                text-inside
                                :percent="load"
                                :stroke-width="3"
                              ></Progress>
                            </template>
                          </div>
                          <div style="margin-top: 15px" class="check">
                            <span class="check_font">身份证正面</span>
                          </div>
                        </Col>
                        <Col span="8">
                          <div class="demo-upload-list-company">
                            <img
                              v-if="enterprIseidCardBackPicFileUrl != ''"
                              style="width: 58px"
                              height="100px"
                              :src="enterprIseidCardBackPicFileUrl"
                            />
                            <img
                              style="width: 58px"
                              height="100px"
                              src="@/assets/vehicleAtes/owner2.png"
                            />
                            <div
                              v-if="enterprIseidCardBackPicFileUrl != ''"
                              class="demo-upload-list-company-cover"
                            >
                              <Icon
                                type="ios-eye-outline"
                                @click.native="
                                  showPic(enterprIseidCardBackPicFileUrl)
                                "
                              ></Icon>
                            </div>
                          </div>
                          <Upload
                            :on-progress="enterprIseidCardf"
                            :beforeUpload="beforeUpload"
                            ref="companyUpload"
                            :show-upload-list="false"
                            :on-success="reverseIDCard"
                            :format="['jpg', 'jpeg', 'png']"
                            :on-format-error="handleFormatError"
                            :headers="header"
                            :data="{
                              fileType: 'IDCARD_BACK_PIC',
                              userId: userCompanyInfoData.userId,
                            }"
                            type="drag"
                            :action="uploadIdCardPic"
                            style="display: inline-block; width: 30px"
                          >
                            <div
                              style="
                                width: 30px;
                                height: 30px;
                                line-height: 30px;
                              "
                            >
                              <Icon type="ios-camera" size="20"></Icon>
                            </div>
                          </Upload>
                          <div class="demo-uploadcss-compny">
                            <template>
                              <Progress
                                v-if="progressReverse"
                                text-inside
                                :percent="load"
                                :stroke-width="3"
                              ></Progress>
                            </template>
                          </div>
                          <div style="margin-top: 15px" class="check">
                            <span class="check_font">身份证反面</span>
                          </div>
                        </Col>
                        <Col span="7" style="margin-left: 5px">
                          <div class="demo-upload-list-company">
                            <img
                              v-if="handHeldProgressIdCard != ''"
                              style="width: 58px"
                              height="100px"
                              :src="handHeldProgressIdCard"
                            />
                            <img
                              style="width: 58px"
                              height="100px"
                              src="@/assets/vehicleAtes/owner2.png"
                            />
                            <div
                              v-if="handHeldProgressIdCard != ''"
                              class="demo-upload-list-company-cover"
                            >
                              <Icon
                                type="ios-eye-outline"
                                @click.native="showPic(handHeldProgressIdCard)"
                              ></Icon>
                            </div>
                          </div>

                          <Upload
                            :on-progress="handHeldPro"
                            :beforeUpload="beforeUpload"
                            ref="backUpload"
                            :show-upload-list="false"
                            :on-success="handHandleSuccess"
                            :before-upload="handleBeforeUpload"
                            :max-size="20480"
                            :on-exceeded-size="handleMaxSize"
                            :on-format-error="handleFormatError"
                            :format="['jpg', 'jpeg', 'png']"
                            type="drag"
                            :default-file-list="idCardBackPicFileList"
                            :headers="header"
                            :data="{
                              fileType: 'IDCARD_FONT_PIC',
                              userId: userCompanyInfoData.userId,
                            }"
                            :action="uploadIdCardPic"
                            style="display: inline-block; width: 30px"
                          >
                            <div
                              style="
                                width: 30px;
                                height: 30px;
                                line-height: 30px;
                              "
                            >
                              <Icon type="ios-camera" size="20"></Icon>
                            </div>
                          </Upload>
                          <div class="demo-uploadcss-compny">
                            <template>
                              <Progress
                                v-if="handHeldProgress"
                                text-inside
                                :percent="load"
                                :stroke-width="3"
                              ></Progress>
                            </template>
                          </div>
                          <div style="margin-top: 15px" class="check">
                            <span class="check_font">手持身份证</span>
                          </div>
                        </Col>
                      </Row>
                    </div>
                  </div>
                  <div class="line"></div>
                  <div class="company-bottom">
                    <div style="width: 750px; margin-left: -36px">
                      <p class="titles">法人信息</p>
                      <div style="margin-left: -44px">
                        <FormItem label="姓名" prop="legalpersonName">
                          <Input
                            style="width: 220px"
                            placeholder="请输入姓名"
                            v-model="companyLicenseForm.legalpersonName"
                          />
                        </FormItem>
                        <FormItem label="联系电话" prop="legalpersonPhone">
                          <Input
                            placeholder="请输入联系电话"
                            v-model="companyLicenseForm.legalpersonPhone"
                            clearable
                            style="width: 220px"
                          />
                        </FormItem>
                      </div>
                      <div style="margin-left: -2px">
                        <FormItem label="身份有效期" prop="legalpersonEndDate">
                          <Input
                            placeholder="请输入身份有效期"
                            style="width: 180px"
                            v-model="companyLicenseForm.legalpersonEndDate"
                            clearable
                          />
                        </FormItem>
                        <FormItem label="身份证号" prop="legalpersonNum">
                          <Input
                            placeholder="请输入身份证号"
                            style="width: 220px"
                            v-model="companyLicenseForm.legalpersonNum"
                            clearable
                          />
                        </FormItem>
                      </div>
                      <Row style="margin-left: 44px; margin-top: 20px">
                        <Col span="8">
                          <div class="demo-upload-list-company">
                            <img
                              v-if="corporateidCardFontPicFileUrl != ''"
                              style="width: 58px"
                              height="100px"
                              :src="corporateidCardFontPicFileUrl"
                            />
                            <img
                              style="width: 58px"
                              height="100px"
                              src="@/assets/vehicleAtes/owner1.png"
                            />
                            <div
                              v-if="corporateidCardFontPicFileUrl != ''"
                              class="demo-upload-list-company-cover"
                            >
                              <Icon
                                type="ios-eye-outline"
                                @click.native="
                                  showPic(corporateidCardFontPicFileUrl)
                                "
                              ></Icon>
                            </div>
                          </div>
                          <Upload
                            :on-progress="corporateIseidCard"
                            :beforeUpload="beforeUpload"
                            ref="companyUpload"
                            :show-upload-list="false"
                            :on-success="corporjustIDCard"
                            :format="['jpg', 'jpeg', 'png']"
                            :on-format-error="handleFormatError"
                            :headers="header"
                            :data="{
                              fileType: 'IDCARD_FONT_PIC',
                              userId: userCompanyInfoData.userId,
                            }"
                            type="drag"
                            :action="uploadIdCardPic"
                            style="display: inline-block; width: 30px"
                          >
                            <div
                              style="
                                width: 30px;
                                height: 30px;
                                line-height: 30px;
                              "
                            >
                              <Icon type="ios-camera" size="20"></Icon>
                            </div>
                          </Upload>
                          <div class="demo-uploadcss-compny">
                            <template>
                              <Progress
                                v-if="corporateFront"
                                text-inside
                                :percent="load"
                                :stroke-width="3"
                              ></Progress>
                            </template>
                          </div>
                          <div style="margin-top: 15px" class="check">
                            <span class="check_font">身份证正面</span>
                          </div>
                        </Col>
                        <Col span="8">
                          <div class="demo-upload-list-company">
                            <img
                              v-if="corporateidCardBackPicFileUrl != ''"
                              style="width: 58px"
                              height="100px"
                              :src="corporateidCardBackPicFileUrl"
                            />
                            <img
                              style="width: 58px"
                              height="100px"
                              src="@/assets/vehicleAtes/owner2.png"
                            />
                            <div
                              v-if="corporateidCardBackPicFileUrl != ''"
                              class="demo-upload-list-company-cover"
                            >
                              <Icon
                                type="ios-eye-outline"
                                @click.native="
                                  showPic(corporateidCardBackPicFileUrl)
                                "
                              ></Icon>
                            </div>
                          </div>
                          <Upload
                            :on-progress="corporateIseidCardf"
                            :beforeUpload="beforeUpload"
                            ref="companyUpload"
                            :show-upload-list="false"
                            :on-success="corporateidIDCard"
                            :format="['jpg', 'jpeg', 'png']"
                            :on-format-error="handleFormatError"
                            :headers="header"
                            :data="{
                              fileType: 'IDCARD_BACK_PIC',
                              userId: userCompanyInfoData.userId,
                            }"
                            type="drag"
                            :action="uploadIdCardPic"
                            style="display: inline-block; width: 30px"
                          >
                            <div
                              style="
                                width: 30px;
                                height: 30px;
                                line-height: 30px;
                              "
                            >
                              <Icon type="ios-camera" size="20"></Icon>
                            </div>
                          </Upload>
                          <div class="demo-uploadcss-compny">
                            <template>
                              <Progress
                                v-if="corporateReverse"
                                text-inside
                                :percent="load"
                                :stroke-width="3"
                              ></Progress>
                            </template>
                          </div>
                          <div style="margin-top: 15px" class="check">
                            <span class="check_font">身份证反面</span>
                          </div>
                        </Col>
                        <Col span="7" style="margin-left: 5px">
                          <div class="demo-upload-list-company">
                            <img
                              v-if="holdIdCardFileId != ''"
                              style="width: 58px"
                              height="100px"
                              :src="holdIdCardFileId"
                            />
                            <img
                              style="width: 58px"
                              height="100px"
                              src="@/assets/vehicleAtes/owner2.png"
                            />
                            <div
                              v-if="holdIdCardFileId != ''"
                              class="demo-upload-list-company-cover"
                            >
                              <Icon
                                type="ios-eye-outline"
                                @click.native="showPic(holdIdCardFileId)"
                              ></Icon>
                            </div>
                          </div>

                          <Upload
                            :on-progress="handHeldCardBackPro"
                            :beforeUpload="beforeUpload"
                            ref="backUpload"
                            :show-upload-list="false"
                            :on-success="handHeldSuccess"
                            :before-upload="handleBeforeUpload"
                            :max-size="20480"
                            :on-exceeded-size="handleMaxSize"
                            :on-format-error="handleFormatError"
                            :format="['jpg', 'jpeg', 'png']"
                            type="drag"
                            :default-file-list="idCardBackPicFileList"
                            :headers="header"
                            :data="{
                              fileType: 'IDCARD_FONT_PIC',
                              userId: userCompanyInfoData.userId,
                            }"
                            :action="uploadIdCardPic"
                            style="display: inline-block; width: 30px"
                          >
                            <div
                              style="
                                width: 30px;
                                height: 30px;
                                line-height: 30px;
                              "
                            >
                              <Icon type="ios-camera" size="20"></Icon>
                            </div>
                          </Upload>
                          <div class="demo-uploadcss-compny">
                            <template>
                              <Progress
                                v-if="handHeldCorporate"
                                text-inside
                                :percent="load"
                                :stroke-width="3"
                              ></Progress>
                            </template>
                          </div>
                          <div style="margin-top: 15px" class="check">
                            <span class="check_font">手持身份证</span>
                          </div>
                        </Col>
                      </Row>
                    </div>
                    <div style="width: 750px; padding-left: 40px">
                      <p class="titles">委托授权书</p>
                      <Row style="margin-left: 44px">
                        <Col span="8">
                          <div class="demo-upload-list-company">
                            <img
                              v-if="agreementUrl != ''"
                              style="width: 58px"
                              height="100px"
                              :src="agreementUrl"
                            />
                            <img
                              style="width: 58px"
                              height="100px"
                              src="@/assets/vehicleAtes/owner3.png"
                            />
                            <div
                              v-if="agreementUrl != ''"
                              class="demo-upload-list-company-cover"
                            >
                              <Icon
                                type="ios-eye-outline"
                                @click.native="showPic(agreementUrl)"
                              ></Icon>
                            </div>
                          </div>
                          <Upload
                            :on-progress="AuthorizationAgreement"
                            :beforeUpload="beforeUpload"
                            ref="companyUpload"
                            :show-upload-list="false"
                            :on-success="handleSuccessAgreement"
                            :format="['jpg', 'jpeg', 'png']"
                            :on-format-error="handleFormatError"
                            :headers="header"
                            :data="{
                              fileType: 'IDCARD_FONT_PIC',
                              userId: userCompanyInfoData.userId,
                            }"
                            type="drag"
                            :action="uploadIdCardPic"
                            style="display: inline-block; width: 30px"
                          >
                            <div
                              style="
                                width: 30px;
                                height: 30px;
                                line-height: 30px;
                              "
                            >
                              <Icon type="ios-camera" size="20"></Icon>
                            </div>
                          </Upload>
                          <div class="demo-uploadcss-compny">
                            <template>
                              <Progress
                                v-if="progressAgreement"
                                text-inside
                                :percent="load"
                                :stroke-width="3"
                              ></Progress>
                            </template>
                          </div>
                          <div style="margin-top: 15px">
                            <span class="check_font" style="margin-left: 5px"
                              >委托授权书照片</span
                            >
                          </div>
                        </Col>
                      </Row>
                    </div>
                  </div>
                  <Row>
                    <Col>
                      <Button
                        style="margin-left: 3px; margin-top: 22px"
                        type="warning"
                        @click="enterpriseCertification"
                        :loading="loadinLicenseInfo"
                        >提交认证</Button
                      >
                    </Col>
                  </Row>
                </Form>
              </div>
            </div>
          </div>
        </div>
      </div>
    </Card>
  </div>
</template>

<script>
import { userInfo } from "@/api/index";
import Cookies from "js-cookie";
// import messageVue from "../message/message.vue";
import { getStore, setStore } from "@/libs/storage";
// 修改密码
import SetPassword from "@/views/my-components/freight/set-password";
import CountDownButton from "@/views/my-components/freight/count-down-button";
// // // // // // // // // // // // // // // // // //
import {
  getCompanyLicenseInfo,
  getIdCarDInfo,
  saveIdCardInfo, //个人认证
  saveCompanyLicenseInfo, //企业认证
} from "@/api/user";
import {
  getPayWallet, //钱包
  userInfoVo, //承运人信息
} from "@/api/ownerEnd/waybillAdmin";
import * as imageConversion from "image-conversion";
import axios from "axios";
import { uploadIdCardPic, upLoadCompanyLicense } from "@/api/index";
export default {
  components: {
    CountDownButton,
    SetPassword,
  },
  name: "ownspace_index",
  props: ["userChoice"],
  data() {
    return {
      activeName: "企业认证",
      area: 86,
      messageOpen: 1,
      avatarImg: "",
      userForm: {
        id: "",
        avatar: "",
        username: "",
        sex: "",
        mobile: "",
        email: "",
        status: "",
        type: "",
        typeTxt: "",
        address: [],
        addressSelection: [],
      },
      header: {
        accessToken: getStore("accessToken"),
      },
      accessToken: getStore("accessToken"),
      mobileEditForm: {
        mobile: "",
        code: "",
        imgCode: "",
      },
      emailEditForm: {
        email: "",
        code: "",
      },
      relate: {},
      jumping: false,
      currMenu: "企业认证",
      dictSex: this.$store.state.dict.sex,

      userCompanyInfoData: {}, // 承运人信息
      userCompanyWalletData: {}, // 获取钱包
      authenticationInformation: {},
      uploadIdCardPic: uploadIdCardPic,
      upLoadCompanyLicense: upLoadCompanyLicense,
      goodsVisible: false,
      loadinLicenseInfo: false,
      loadingsubmi: false,
      idCardIdForm: {
        userId: "",
        name: "", //名字
        num: "", //身份证号
        address: "", //居住地址
        birth: "", //生日
        sex: "", //性别
        nationality: "", //籍贯
        startDate: "", //身份证开始有效期
        endDate: "", //身份证结束有效期
        issue: "", //发证机关
        idCardFontPicFileId: "", //身份证正面照ID
        idCardBackPicFileId: "", //身份证背面照ID
        holdIdCardFileId: "", //手持身份证照片ID
        contactPhone: "", //联系人电话
      },
      companyLicenseForm: {
        userId: "",
        companyName: "", //公司名称
        companyUserName: "", //法人
        certNo: "", //公司统一社会信用代码
        companyPhone: "", //公司注册电话
        street: "", //通讯地址
        companyUserPhone: "", //法人电话
        bankName: "", //开户行
        bankCode: "", //开户行账号
        type: "", //公司类型
        capital: "", //注册资金
        business: "", //经营范围
        startDate: "", //注册时间
        endDate: "", //截止日期
        companyLicenseFileId: "", //公司营业执照图片地址
        authorizationId: "", //委托授权书
        //联系人
        contactPhone: "", //联系人 --- 电话
        contactNum: "", //联系人 ---  身份证号
        contactName: "", //联系人 --- 姓名
        contactAddress: "", //联系人 --- 地址
        contactBirth: "", //联系人 --- 生日
        contactSex: "", //联系人 --- 性别
        contactNationality: "", //联系人 ---  民族
        contactStartDate: "", //联系人 --- 身份证起始日期
        contactEndDate: "", //联系人 --- 身份证结束日期
        contactIssue: "", //联系人 --- 签发机关
        contactIdCardFontPicFileId: "", //联系人 --- 身份证前置照片地址
        contactIdCardBackPicFileId: "", //联系人 --- 身份证后置照片地址
        contactHoldIdCardFileId: "", //联系人 --- 手持身份证照片ID
        //法人
        legalpersonNum: "", //法人 --- 身份证号
        legalpersonName: "", //法人 --- 姓名
        legalpersonPhone: "", //	法人 --- 联系电话
        legalpersonEndDate: "", //法人 --- 身份证结束日期
        legalpersonIdCardFontPicFileId: "", //	法人 --- 身份证前置照片地址
        legalpersonIdCardBackPicFileId: "", //法人 --- 身份证后置照片地址
        legalpersonHoldIdCardFileId: "", //法人 --- 手持身份证照片ID
      },
      companyForm: {
        companyName: [
          { required: true, message: "请输入公司名称", trigger: "blur" },
        ],
        companyUserName: [
          { required: true, message: "请输入法定代表人", trigger: "blur" },
        ],
        street: [
          { required: true, message: "请输入通讯地址", trigger: "blur" },
        ],
        companyUserPhone: [
          { required: true, message: "请输入法人电话", trigger: "blur" },
        ],
        companyPhone: [
          { required: true, message: "请输入注册电话", trigger: "blur" },
        ],
        bankName: [
          { required: true, message: "请输入开户银行", trigger: "blur" },
        ],
        bankCode: [
          { required: true, message: "请输入银行账号", trigger: "blur" },
        ],
        certNo: [
          {
            required: true,
            message: "请输入统一社会信用代码",
            trigger: "blur",
          },
        ],
        type: [{ required: true, message: "请输入公司类型", trigger: "blur" }],
        contactName: [
          { required: true, message: "请输入姓名", trigger: "blur" },
        ],
        contactPhone: [
          { required: true, message: "请输入联系电话", trigger: "blur" },
        ],
        contactEndDate: [
          { required: true, message: "请输入身份有效期", trigger: "blur" },
        ],
        contactNum: [
          { required: true, message: "请输入身份证号", trigger: "blur" },
        ],

        legalpersonName: [
          { required: true, message: "请输入姓名", trigger: "blur" },
        ],
        legalpersonPhone: [
          { required: true, message: "请输入联系电话", trigger: "blur" },
        ],
        legalpersonEndDate: [
          { required: true, message: "请输入身份有效期", trigger: "blur" },
        ],
        legalpersonNum: [
          { required: true, message: "请输入身份证号", trigger: "blur" },
        ],
      },
      progressBusinessLicen: false, // 营业执照
      progressCardBack: false, // 个人认证 身份证反面
      progressFlagnum: false, // 个人认证 身份证正面
      personalIDCard: false, // 个人认证 手拿身份证

      progressFront: false, // 联系人信息 身份证正面
      progressReverse: false, // 联系人信息 身份证反面
      handHeldProgress: false, //手持身份证联系人

      corporateFront: false, // 法人信息： 身份证正面
      corporateReverse: false, // 法人信息： 身份证反面
      progressAgreement: false, //授权协议书
      handHeldCorporate: false, //手持身份证法人

      idCardFontPicFileUrl: "", // 个人认证 身份证正面
      idCardBackPicFileUrl: "", // 个人认证 身份证反面
      personalIDCardUrl: "", // 个人认证 手拿身份证

      enterpriseIdCardFontPicFileUrl: "", // 联系人信息 身份证正面
      enterprIseidCardBackPicFileUrl: "", // 联系人信息 身份证反面
      handHeldProgressIdCard: "", //手持身份证联系人

      corporateidCardFontPicFileUrl: "", // 法人信息： 身份证正面
      corporateidCardBackPicFileUrl: "", // 法人信息： 身份证反面
      holdIdCardFileId: "", //手持身份证法人

      companyPicFileUrl: "", // 营业执照
      agreementUrl: "", //授权协议书

      // 表单验证规则
      idCardBackPicFileList: [],
      formValidate: {
        name: [{ required: true, message: "请输入真实姓名", trigger: "blur" }],
        num: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
        birth: [{ required: true, message: "请输入出生日期", trigger: "blur" }],
        sex: [{ required: true, message: "请输入性别", trigger: "blur" }],
        startDate: [
          { required: true, message: "请输入开始日期", trigger: "blur" },
        ],
        endDate: [
          { required: true, message: "请输入身份有效期", trigger: "blur" },
        ],
        address: [
          { required: true, message: "请输入家庭地址", trigger: "blur" },
        ],
        contactsName: [
          { required: true, message: "请输入联系人姓名", trigger: "blur" },
        ],
        contactPhone: [
          { required: true, message: "请输入联系人电话", trigger: "blur" },
        ],
      },
      load: 0,
    };
  },

  methods: {
    getStartArea(value, selectedData) {
      if (value.length == 3) {
        this.userForm.address = value;
      }
    },
    init() {
      // 基本信息
      this.essentialInformation();

      let v = JSON.parse(Cookies.get("userInfo"));
      // 转换null为""
      for (let attr in v) {
        if (v[attr] == null) {
          v[attr] = "";
        }
      }
      let str = JSON.stringify(v);
      let userInfo = JSON.parse(str);
      this.userForm = userInfo;
      this.initPhone = userInfo.mobile;
      this.mobileEditForm.mobile = userInfo.mobile;
      this.initEmail = userInfo.email;
      this.emailEditForm.email = userInfo.email;
      if (this.userForm.type == 0) {
        this.userForm.typeTxt = "普通用户";
      } else if (this.userForm.type == 1) {
        this.userForm.typeTxt = "管理员";
      }
      this.userForm.addressSelection = userInfo.address.split(",");

      let messageOpen = this.getStore("messageOpen");
      if (
        messageOpen != "" &&
        messageOpen != undefined &&
        messageOpen != null
      ) {
        this.messageOpen = Number(messageOpen);
      } else {
        this.setStore("messageOpen", 1);
      }
    },

    // 切换
    changeMenu(v) {
      this.currMenu = v;
      if (v == "基本信息") {
        this.essentialInformation(); // 基本信息
      } else if (v == "安全设置") {
      } else if (v == "个人认证") {
        // 承运人认证信息
        this.getOwnerCertification();
        // 承运人信息
        this.getUserCompanyInfoData();
      } else if (v == "企业认证") {
        // 企业认证信息
        this.getCompanyLicense();
        //承运人信息
        this.getUserCompanyInfoData();
      }
    },
    // // // v// // // // // // // // // // // // // // // // //
    // 基本信息
    essentialInformation() {
      userInfo().then((res) => {
        if (res.success) {
          // 避免超过大小限制
          delete res.result.permissions;
          let roles = [];
          res.result.roles.forEach((e) => {
            roles.push(e.name);
          });
          localStorage.setItem("jurisdictionCargo", roles);
          delete res.result.roles;
          this.setStore("roles", roles);
          // 保存7天
          Cookies.set("userInfo", JSON.stringify(res.result), {
            expires: 7,
          });
          this.setStore("userInfo", res.result);
          this.$store.commit("setAvatarPath", res.result.avatar);
          // 加载菜单
          // util.initRouter(this);
          // this.$router.push({
          //   name: "home_index",
          // });
        } else {
          this.socialLogining = false;
          this.$Message.error("获取登录用户信息失败");
        }
      });
    },

    //承运人信息
    getUserCompanyInfoData() {
      userInfoVo().then((res) => {
        if (res.result.companyInfoVo) {
          this.userCompanyInfoData = res.result.companyInfoVo;
        } else {
          this.authenticationInformation = res.result;
        }
        this.idCardIdForm.contactPhone = res.result.companyInfoVo.mobile;
        this.companyLicenseForm.contactPhone = res.result.companyInfoVo.mobile;

        this.companyLicenseForm.legalpersonPhone =
          res.result.companyInfoVo.mobile;
        this.companyLicenseForm.companyUserPhone =
          res.result.companyInfoVo.mobile;
      });
    },
    //
    // 获取认证信息
    getAuthenticationInformation() {
      // 企业认证信息
      this.getCompanyLicense();
      // 承运人认证信息
      // this.getOwnerCertification();
    },
    // 企业认证信息
    getCompanyLicense() {
      getCompanyLicenseInfo({ userId: this.userCompanyInfoData.userId }).then(
        (res) => {
          if (res.success) {
            if (res.result != null) {
              // debugger;
              this.companyLicenseForm = res.result;
              this.companyLicenseForm.companyLicenseFileId;
              if (this.companyLicenseForm.companyLicenseFileId != null) {
                this.companyPicFileUrl =
                  this.$baseUrl +
                  "/freight/file/view/" +
                  this.companyLicenseForm.companyLicenseFileId +
                  "?accessToken=" +
                  this.accessToken +
                  "&preview=true";
              }
            }
          } else {
            this.$Message.error(res.message);
          }
        }
      );
    },
    // 承运人认证信息
    getOwnerCertification() {
      getIdCarDInfo({ userId: this.userCompanyInfoData.userId }).then((res) => {
        if (res.success) {
          if (res.result != null) {
            this.idCardIdForm = res.result;
            this.idCardIdForm.startDate =
              res.result.startDate == null
                ? ""
                : res.result.startDate.replaceAll("-", "");
            this.idCardIdForm.endDate =
              res.result.endDate == null
                ? ""
                : res.result.endDate.replaceAll("-", "");

            if (this.idCardIdForm.idCardFontPicFileId != null) {
              this.idCardFontPicFileUrl =
                this.$baseUrl +
                "/freight/file/view/" +
                this.idCardIdForm.idCardFontPicFileId +
                "?accessToken=" +
                this.accessToken +
                "&preview=true";
            }

            if (this.idCardIdForm.idCardBackPicFileId != null) {
              this.idCardBackPicFileUrl =
                this.$baseUrl +
                "/freight/file/view/" +
                this.idCardIdForm.idCardBackPicFileId +
                "?accessToken=" +
                this.accessToken +
                "&preview=true";
            }
          }
        } else {
          this.$Message.error(res.message);
        }
      });
    },
    // 图片超出指定大小限制时的钩子
    handleMaxSize(file) {
      this.$Message.error("图片超出了最大存储限制");
    },
    //图片格式验证失败时的钩子
    handleFormatError(file) {
      this.$Message.error("图片格式错误,指定上传图片格式 jpg、jpeg、png");
    },
    //身份证正面进度条 个人认证
    cardFontProcess(event, file, fileList) {
      this.progressAll(event, 1);
    },
    //身份证反面进度条 个人认证
    CardBackPro(event, file, fileList) {
      this.progressAll(event, 2);
    },
    // 营业执照 企业信息
    BusinessLicen(event, file, fileList) {
      this.progressAll(event, 3);
    },

    // 身份证正面 联系人信息
    enterprIseidCard(event, file, fileList) {
      this.progressAll(event, 4);
    },
    // 身份证反面 联系人信息
    enterprIseidCardf(event, file, fileList) {
      this.progressAll(event, 5);
    },

    // 身份证正面 法人信息
    corporateIseidCard(event, file, fileList) {
      this.progressAll(event, 6);
    },
    // 身份证反面 法人信息
    corporateIseidCardf(event, file, fileList) {
      this.progressAll(event, 7);
    },

    // 授权协议书
    AuthorizationAgreement(event, file, fileList) {
      this.progressAll(event, 8);
    },
    // 手持身份证联系人
    handHeldPro(event, file, fileList) {
      this.progressAll(event, 9);
    },
    // 手持身份证法人信息
    handHeldCardBackPro(event, file, fileList) {
      this.progressAll(event, 10);
    },
    // 手持身份证个人认证
    scardBackPro(event, file, fileList) {
      this.progressAll(event, 11);
    },

    //身份证正面进度条 个人认证
    cardFontHandleSuccess(res, file, fileList) {
      if (res.code == 500) {
        this.$Message.error(res.message);
        return;
      } else if (res.code == 200) {
        this.$Message.success("上传成功");
        this.form = { ...this.form, ...res.result };
        this.idCardIdForm.name = res.result.name;
        this.idCardIdForm.num = res.result.num;
        this.idCardIdForm.address = res.result.address;
        this.idCardIdForm.nationality = res.result.nationality;
        this.idCardIdForm.sex = res.result.sex;
        this.idCardIdForm.birth = res.result.birth;
        this.idCardIdForm.idCardFontPicFileId = res.result.fileId;
        if (this.idCardIdForm.idCardFontPicFileId != null) {
          this.idCardFontPicFileUrl =
            this.$baseUrl +
            "/freight/file/view/" +
            this.idCardIdForm.idCardFontPicFileId +
            "?accessToken=" +
            this.accessToken +
            "&preview=true";
        }
      }
    },
    //身份证反面进度条 个人认证
    cardBackHandleSuccess(res, file, fileList) {
      if (res.code == 500) {
        this.$Message.error(res.message);
        return;
      } else if (res.code == 200) {
        this.$Message.success("上传成功");
        this.form = { ...this.form, ...res.result };
        this.idCardIdForm.startDate = res.result.startDate;
      }

      //判断长期+99年
      if (res.result.endDate == "长期") {
        let dateNew = Number(res.result.startDate) + Number(990000);
        this.idCardIdForm.endDate = dateNew + "";
      } else {
        this.idCardIdForm.endDate = res.result.endDate;
      }

      this.idCardIdForm.issue = res.result.issue;
      this.idCardIdForm.idCardBackPicFileId = res.result.fileId;
      if (this.idCardIdForm.idCardBackPicFileId != null) {
        this.idCardBackPicFileUrl =
          this.$baseUrl +
          "/freight/file/view/" +
          this.idCardIdForm.idCardBackPicFileId +
          "?accessToken=" +
          this.accessToken +
          "&preview=true";
      }
    },
    //手持身份证
    personalIDSuccess(res, file, fileList) {
      if (res.code == 500) {
        this.$Message.error(res.message);
        return;
      } else if (res.code == 200) {
        this.$Message.success("上传成功");
      }
      this.idCardIdForm.holdIdCardFileId = res.result.fileId;
      if (res.result.fileId != null) {
        this.personalIDCardUrl =
          this.$baseUrl +
          "/freight/file/view/" +
          res.result.fileId +
          "?accessToken=" +
          this.accessToken +
          "&preview=true";
      }
    },
    // 实名提交认证
    realNameAuthentication() {
      this.$refs.idCardIdForm.validate((valid) => {
        if (valid) {
          if (this.idCardFontPicFileUrl == "") {
            return this.$Message.error("请上传身份证正面");
          } else if (this.idCardBackPicFileUrl == "") {
            return this.$Message.error("请上传身份证背面");
          } else if (this.personalIDCardUrl == "") {
            return this.$Message.error("请上传手持身份证照片");
          }
          this.loadingsubmi = true;
          this.idCardIdForm.userId = this.userCompanyInfoData.userId;
          saveIdCardInfo(this.idCardIdForm).then((res) => {
            this.loadingsubmi = false;
            this.submitLoading = false;
            if (res.code == 200) {
              this.$Message.success("认证资料提交成功");
              // 企业认证信息
              this.getUserCompanyInfoData();
              this.$emit("authenticatiSuccess", "1");
            } else {
              this.$Message.error(res.message);
            }
          });
        }
      });
    },
    // 企业提交认证
    enterpriseCertification() {
      this.$refs.companyLicenseForm.validate((valid) => {
        if (valid) {
          if (this.companyPicFileUrl == "") {
            return this.$Message.error("请上传营业执照");
          }
          if (this.enterpriseIdCardFontPicFileUrl == "") {
            return this.$Message.error("请上传联系人身份证正面");
          }
          if (this.enterprIseidCardBackPicFileUrl == "") {
            return this.$Message.error("请上传联系人身份证反面");
          }
          if (this.handHeldProgressIdCard == "") {
            return this.$Message.error("请上传联系人手持身份证");
          }
          if (this.corporateidCardFontPicFileUrl == "") {
            return this.$Message.error("请上传法人身份证反面");
          }
          if (this.corporateidCardBackPicFileUrl == "") {
            return this.$Message.error("请上传法人身份证反面");
          }
          if (this.holdIdCardFileId == "") {
            return this.$Message.error("请上传法人手持身份证");
          }
          this.loadinLicenseInfo = true;
          this.companyLicenseForm.userId = this.userCompanyInfoData.userId;
          saveCompanyLicenseInfo(this.companyLicenseForm).then((res) => {
            this.loadinLicenseInfo = false;
            if (res.code == 200) {
              this.$Message.success("认证资料提交成功");
              // 企业认证信息
              this.getUserCompanyInfoData();
              this.$emit("authenticatiSuccess", "1");
            } else {
              this.$Message.error(res.message);
            }
          });
        }
      });
    },

    // 营业执照
    handleSuccess(res, file, fileList) {
      if (res.code == 500) {
        this.$Message.error(res.message);
        return;
      } else if (res.code == 200) {
        this.$Message.success("上传成功");
        this.form = { ...this.form, ...res.result };
        // this.companyLicenseForm = res.result;
        this.companyLicenseForm.companyName = res.result.companyName;
        this.companyLicenseForm.companyUserName = res.result.companyUserName;
        this.companyLicenseForm.certNo = res.result.certNo;
        this.companyLicenseForm.companyPhone = res.result.companyPhone;
        this.companyLicenseForm.street = res.result.street;
        this.companyLicenseForm.bankName = res.result.bankName;
        this.companyLicenseForm.bankCode = res.result.bankCode;
        this.companyLicenseForm.type = res.result.type;
        this.companyLicenseForm.capital = res.result.capital;
        this.companyLicenseForm.business = res.result.business;
        this.companyLicenseForm.startDate = res.result.startDate;
        this.companyLicenseForm.endDate = res.result.endDate;
        this.companyLicenseForm.companyLicenseFileId = res.result.fileId;
        if (this.companyLicenseForm.companyLicenseFileId != null) {
          this.companyPicFileUrl =
            this.$baseUrl +
            "/freight/file/view/" +
            this.companyLicenseForm.companyLicenseFileId +
            "?accessToken=" +
            this.accessToken +
            "&preview=true";
        }
      }
    },
    // 联系人信息身份证正面
    enterpriseID(res, file, fileList) {
      if (res.code == 500) {
        this.$Message.error(res.message);
        return;
      } else if (res.code == 200) {
        this.$Message.success("上传成功");
        this.form = { ...this.form, ...res.result };
        this.companyLicenseForm.contactName = res.result.name;
        this.companyLicenseForm.contactNum = res.result.num;
        this.companyLicenseForm.contactAddress = res.result.address;
        this.companyLicenseForm.contactNationality = res.result.nationality;
        this.companyLicenseForm.contactSex = res.result.sex;
        this.companyLicenseForm.contactBirth = res.result.birth;
        this.companyLicenseForm.contactIdCardFontPicFileId = res.result.fileId;
        if (this.companyLicenseForm.contactIdCardFontPicFileId != null) {
          this.enterpriseIdCardFontPicFileUrl =
            this.$baseUrl +
            "/freight/file/view/" +
            this.companyLicenseForm.contactIdCardFontPicFileId +
            "?accessToken=" +
            this.accessToken +
            "&preview=true";
        }
      }
    },
    // 联系人信息身份证反面
    reverseIDCard(res, file, fileList) {
      if (res.code == 500) {
        this.$Message.error(res.message);
        return;
      } else if (res.code == 200) {
        this.$Message.success("上传成功");
        this.form = { ...this.form, ...res.result };
        this.companyLicenseForm.contactStartDate = res.result.startDate;
      }
      //判断长期+99年
      if (res.result.endDate == "长期") {
        let dateNew = Number(res.result.startDate) + Number(990000);
        this.companyLicenseForm.contactEndDate = dateNew + "";
      } else {
        this.companyLicenseForm.contactEndDate = res.result.endDate;
      }

      this.companyLicenseForm.contactIssue = res.result.issue;
      this.companyLicenseForm.contactIdCardBackPicFileId = res.result.fileId;

      if (this.companyLicenseForm.contactIdCardBackPicFileId != null) {
        this.enterprIseidCardBackPicFileUrl =
          this.$baseUrl +
          "/freight/file/view/" +
          this.companyLicenseForm.contactIdCardBackPicFileId +
          "?accessToken=" +
          this.accessToken +
          "&preview=true";
      }
    },
    //联系人 手持身份证
    handHandleSuccess(res, file, fileList) {
      if (res.code == 500) {
        this.$Message.error(res.message);
        return;
      } else if (res.code == 200) {
        this.$Message.success("上传成功");
      }
      this.companyLicenseForm.contactHoldIdCardFileId = res.result.fileId;
      if (res.result.fileId != null) {
        this.handHeldProgressIdCard =
          this.$baseUrl +
          "/freight/file/view/" +
          res.result.fileId +
          "?accessToken=" +
          this.accessToken +
          "&preview=true";
      }
    },

    //  法人信息身份证
    corporjustIDCard(res, file, fileList) {
      if (res.code == 500) {
        this.$Message.error(res.message);
        return;
      } else if (res.code == 200) {
        this.$Message.success("上传成功");
        this.form = { ...this.form, ...res.result };
        this.companyLicenseForm.legalpersonName = res.result.name;
        this.companyLicenseForm.legalpersonNum = res.result.num;
        this.companyLicenseForm.legalpersonIdCardFontPicFileId =
          res.result.fileId;
        if (this.companyLicenseForm.legalpersonIdCardFontPicFileId != null) {
          this.corporateidCardFontPicFileUrl =
            this.$baseUrl +
            "/freight/file/view/" +
            this.companyLicenseForm.legalpersonIdCardFontPicFileId +
            "?accessToken=" +
            this.accessToken +
            "&preview=true";
        }
      }
    },
    // 法人信息份证反面
    corporateidIDCard(res, file, fileList) {
      if (res.code == 500) {
        this.$Message.error(res.message);
        return;
      } else if (res.code == 200) {
        this.$Message.success("上传成功");
        this.form = { ...this.form, ...res.result };
        this.companyLicenseForm.startDate = res.result.startDate;
      }

      //判断长期+99年
      if (res.result.endDate == "长期") {
        let dateNew = Number(res.result.startDate) + Number(990000);
        this.companyLicenseForm.legalpersonEndDate = dateNew + "";
      } else {
        this.companyLicenseForm.legalpersonEndDate = res.result.endDate;
      }
      this.companyLicenseForm.legalpersonIdCardBackPicFileId =
        res.result.fileId;
      if (this.companyLicenseForm.legalpersonIdCardBackPicFileId != null) {
        this.corporateidCardBackPicFileUrl =
          this.$baseUrl +
          "/freight/file/view/" +
          this.companyLicenseForm.legalpersonIdCardBackPicFileId +
          "?accessToken=" +
          this.accessToken +
          "&preview=true";
      }
    },
    // 手持身份证法人
    handHeldSuccess(res, file, fileList) {
      if (res.code == 500) {
        this.$Message.error(res.message);
        return;
      } else if (res.code == 200) {
        this.$Message.success("上传成功");
      }

      this.companyLicenseForm.legalpersonHoldIdCardFileId = res.result.fileId;
      if (res.result.fileId != null) {
        this.holdIdCardFileId =
          this.$baseUrl +
          "/freight/file/view/" +
          res.result.fileId +
          "?accessToken=" +
          this.accessToken +
          "&preview=true";
      }
    },
    // 授权协议书
    handleSuccessAgreement(res, file, fileList) {
      if (res.code == 500) {
        this.$Message.error(res.message);
        return;
      } else if (res.code == 200) {
        this.$Message.success("上传成功");
      }
      this.companyLicenseForm.authorizationId = res.result.fileId;
      if (res.result.fileId != null) {
        this.agreementUrl =
          this.$baseUrl +
          "/freight/file/view/" +
          res.result.fileId +
          "?accessToken=" +
          this.accessToken +
          "&preview=true";
      }
    },
    // 查看图片
    showPic(v) {
      let image = new Image();
      image.src = v;
      let viewer = new Viewer(image, {
        hidden: function () {
          viewer.destroy();
        },
      });
      viewer.show();
    },
    // 进度条
    progressAll(data, num) {
      if (num == 1) {
        //身份证正面进度条
        this.progressFlagnum = true; // 显示进度条
      } else if (num == 2) {
        //身份证反面进度条
        this.progressCardBack = true; // 显示进度条
      } else if (num == 3) {
        this.progressBusinessLicen = true;
      } else if (num == 4) {
        this.progressFront = true;
      } else if (num == 5) {
        this.progressReverse = true;
      } else if (num == 6) {
        this.corporateFront = true;
      } else if (num == 7) {
        this.corporateReverse = true;
      } else if (num == 8) {
        this.progressAgreement = true;
      } else if (num == 9) {
        this.handHeldProgress = true;
      } else if (num == 10) {
        this.handHeldCorporate = true;
      } else if (num == 11) {
        this.personalIDCard = true;
      }

      var CardBack = setTimeout(() => {
        this.load = parseInt(data.percent); // 动态获取文件上传进度
      }, 500); // 一秒后关闭进度条
      setTimeout(() => {
        if (this.load >= 100) {
          this.load = 100;
          setTimeout(() => {
            if (num == 1) {
              this.progressFlagnum = false; // 显示进度条
            } else if (num == 2) {
              this.progressCardBack = false; // 显示进度条
            } else if (num == 3) {
              this.progressBusinessLicen = false;
            } else if (num == 4) {
              this.progressFront = false;
            } else if (num == 5) {
              this.progressReverse = false;
            } else if (num == 6) {
              this.corporateFront = false;
            } else if (num == 7) {
              this.corporateReverse = false;
            } else if (num == 8) {
              this.progressAgreement = false;
            } else if (num == 9) {
              this.handHeldProgress = false;
            } else if (num == 10) {
              this.handHeldCorporate = false;
            } else if (num == 11) {
              this.personalIDCard = false;
            }
          }, 1000); // 一秒后关闭进度条
          clearTimeout(CardBack);
        }
      }, 501);
    },
    //压缩图片
    beforeUpload(file) {
      return new Promise((resolve, reject) => {
        // console.log("压缩前", file); // 压缩到400KB,大于400KB的图片都会进行压缩，小于则不会
        imageConversion.compressAccurately(file, 100).then((res) => {
          res = new File([res], file.name, {
            type: res.type,
            lastModified: Date.now(),
          });
          resolve(res);
        });
      });
    },
  },
  mounted() {
    // let type = this.$route.query.type;
    // if (type == "social") {
    //   this.activeName = "第三方账号绑定";
    //   this.currMenu = "第三方账号绑定";
    // }
    this.init();
    this.activeName = this.userChoice;
    this.currMenu = this.userChoice;
  },
  created() {
    // 承运人信息
    this.getUserCompanyInfoData();
  },
};
</script>
<style lang="less">
.demo-upload-list-company {
  display: inline-block;
  width: 150px;
  height: 90px;
  text-align: center;
  line-height: 60px;
  border: 1px solid transparent;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
  position: relative;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  margin-right: 4px;
}
.demo-upload-list-company img {
  width: 148px !important;
  height: 88.2px !important;
}
.demo-upload-list-company-cover {
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.6);
}
.demo-upload-list-company:hover .demo-upload-list-company-cover {
  display: block;
}
.demo-upload-list-company-cover i {
  color: #fff;
  font-size: 20px;
  cursor: pointer;
  margin: 0 2px;
  line-height: 90px;
}

//
.check {
  &::before {
    content: "*";
    display: inline-block;
    margin-right: 2px;
    line-height: 1;
    font-family: SimSun;
    font-size: 14px;
    color: #ed4014;
  }
}
.checkdrag {
  &::before {
    content: "*";
    display: inline-block;
    margin-right: 2px;
    line-height: 1;
    font-family: SimSun;
    font-size: 14px;
    color: #ed4014;
    width: 5px;
    margin-left: 5px;
  }
}

.demo-uploadcss-compny {
  margin-top: -13px;
  width: 150px;
  height: 5px;
}
.adoptSubmitId {
  display: flex;
  justify-content: flex-end;
  margin-top: 347px;
}
.Cardokbtn-comy-comy {
  position: relative;
  bottom: 10px;
  left: 0;
  text-align: right;
}
.okbtn-comy {
  z-index: 99999;
  width: 100%;
  margin-top: -15px;
  // background-color: #f5f5f5;
  // border: 1px solid #cdcdcd;
  // height: 70px;
  // line-height: 70px;
}
.demo-drawer-footers-company {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 10px 16px;
  text-align: right;
  background-color: #f5f5f5;
  border: 1px solid #cdcdcd;
}
.check_font_message {
  font-size: 10px;
  color: #ed4014;
  font-weight: 600;
}
.check_font {
  font-size: 10px;
  font-weight: 600;
}
.titles {
  font-size: 14px;
  font-weight: 600;
  color: rgba(0, 0, 0, 0.85);
  margin-left: 40px;
  margin-top: -20px;
  margin-bottom: 10px;
}
.titles1 {
  font-size: 14px;
  font-weight: 600;
  color: rgba(0, 0, 0, 0.85);
  margin-left: 18px;
  margin-top: -20px;
  margin-bottom: 10px;
}
.company-bottom {
  display: flex;
  margin-top: 40px;
}
.line {
  margin: 20px 0;
  border-bottom: 1px solid #eee;
}
</style>
